<!DOCTYPE html>
<html>
  {% load static %}
  <head>
    <title>{{ template_data.title }}</title>
      <link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}">
{#      <link rel="stylesheet" type="text/css" href="{% static 'css/all.min.css' %}">#}
    <script src="{% static  'js/bootstrap.bundle.min.js' %}"></script>
  <link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
  </head>

  <body>
    <!-- Header -->
    <nav class="p-3 navbar navbar-dark bg-dark navbar-expand-lg">
      <div class="container">
        <a class="navbar-brand" href="{% url 'home.index' %}">
          <img src="{% static 'img/logo.png' %}" alt="logo" height="40" />
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
          aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
          <div class="navbar-nav ms-auto navbar-ml">
              <p><a class="nav-link" href="{% url 'home.about' %}">About</a></p>
            <p><a class="nav-link" href="{% url 'movies.index' %}">Movies</a></p>
            <p><a class="nav-link" href="{% url 'cart.index' %}">Cart</a></p>
            <div class="vr bg-white mx-2 d-none d-lg-block"></div>
              {% if user.is_authenticated %}
                  <a class="nav-link" href="{% url 'accounts.orders' %}">Orders</a></a>
                  <p><a class="nav-link" href="{% url 'accounts.logout' %}">Logout （{{ user.username }}）</a></p>
              {% else %}
              <p><a class="nav-link" href="{% url 'accounts.login' %}">Login</a></p>
              <p><a class="nav-link" href="{% url 'accounts.signup' %}">Sign up</a></p>
              {% endif %}
          </div>
        </div>
      </div>
    </nav>
    <!-- Header -->

    <div>
      {% block content %}
      {% endblock content %}
    </div>

    <!-- Footer -->
    <section class="p-3 ms-footer d-none d-md-block">
      <div class="container">
        <div class="row mt-3 text">
          <div class="col-md-6 col-lg-6 col-xl-6 mx-auto mb-4">
            <b>MOVIES STORE</b>
            <hr />
            <p>Welcome to Movies Store, your premier online destination for a cinematic
              adventure like no other! Dive into the world of movies from the comfort of your own home with our user-friendly
              and immersive online movie store.</p>
          </div>
          <div class="col-md-3 col-lg-3 col-xl-3 mx-auto mb-4">
            <b>LINKS</b>
            <hr />
          </div>
          <div class="col-md-3 col-lg-3 col-xl-3 mx-auto mb-4">
            <b>CONTACT</b>
            <hr />
            <p><i class="fas fa-home me-2"></i> 150-2345 Tokyo-to, Japan</p>
            <p><i class="fas fa-envelope me-2"></i> info@moviesstore.com</p>
            <p><i class="fas fa-phone me-2"></i> +81 03-3333-3333</p>
          </div>
        </div>
      </div>
    </section>
    <section class="p-3 ms-footer-bottom bg-dark">
      <div class="container d-flex justify-content-between">
        <div class="me-5 text-white">
          <span>DESIGNED BY <a href="https://www.x.com/danielgarax" target="_blank">DANIEL CORREA</a> &
            <a href="https://www.x.com/greglim81" target="_blank">GREG LIM</a>
          </span>
        </div>
        <div class="text-white">
          <span>© Copyright - 2024</span>
        </div>
      </div>
    </section>
    <!-- Footer -->
  {% block scripts %}

  {% endblock %}
  </body>
</html>